<header class="header">
  <div class="container">
    <div class="row justify-content-lg-center">
        <div class="col-12 col-lg-9">
            <nav class="navbar navbar-expand-lg navbar-light">
        
                <a class="navbar-brand" href="#">
                  <img class="lqsblog-logo" src="../../assets/img//logo.png" alt="lqsblog">
                </a>
        
                <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                  <span class="navbar-toggler-icon"></span>
                </button>
              
                <div class="collapse navbar-collapse" id="navbarSupportedContent">
                  <ul class="navbar-nav mx-auto ">
                      <li class="nav-item active">
                      <a class="nav-link" href="./index.html">首页</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link" href="./about.html">关于</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link " href="./article.html">随笔</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link " href="./works.html">作品</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link" href="./topics.html">专题</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link" href="./links.html">邻居</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link" href="http://docs.liqingsong.cc"  target="_blank">开源</a>
                    </li>
                    <li class="nav-item">
                      <a class="nav-link" href="https://github.com/lqsong/lqsblog-frontend-foreground-template" target="_blank">Github</a>
                    </li>
                  </ul>
                </div>

                <div class="lqsblog-search" data-toggle="modal" data-target="#searchModal">
                  <svg class="icon" aria-hidden="true">
                      <use xlink:href="#lqsblog-search"></use>
                  </svg>
                </div>


            </nav>
        </div>
    </div>
  </div>
</header>

<!-- Modal -->
<div class="modal fade" id="searchModal" tabindex="-1" role="dialog" aria-labelledby="searchModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-body">
        <form action="./search.html">
          <div class="input-group">
            <input id="jq-search-input" type="text" class="form-control" placeholder="请输入搜索内容">
            <div class="input-group-append">
              <button id="jq-search-btn" class="btn btn-outline-secondary" type="submit">搜索</button>
              <button class="btn btn-outline-secondary" type="button" data-dismiss="modal">取消</button>
            </div>
          </div>
          <div id="jq-search-tips" class="text-danger text-center small"></div>
        </form>
      </div>
    </div>
  </div>
</div>
